取得了Google API Key之後，接下來就可以測試 Cordova Geolocation 和 Google Map的整合囉!

Cordova Geolocation Plugin 與 Google Maps Javascript API 撰寫時需注意的部份有：

1.我們需要載入帶有Google API Key的 Google Maps Javascript API。
2.在前端HTML檔案，須建一個DIV放要顯示的地圖。
3.用Geolocation Plugin 取得目前坐標，做為地圖的中心點。
4.Jack, I'll nerver let go and don't forget 「device ready」,
device ready on success ，再進入create map function.

下面這個是使用 GetCurrentPosition的Google Map。

再來是相關的js碼

(function () {
    "use strict";
    document.addEventListener("deviceready", onDeviceReady, false);
  
    function onDeviceReady() {
        var getoptions = { enableHighAccuracy: true, timeout: 30000 };
        navigator.geolocation.getCurrentPosition(getSuccess, getError, getoptions);
    }
    var getSuccess = function (getposition) {
        var element1 = document.getElementById('show_getPosition');
        var getLat = getposition.coords.latitude;
        var getLon = getposition.coords.longitude;
        element1.innerHTML = "這是getPosition資訊<br />" +
              "緯度 " + getposition.coords.latitude + "<br />" +
              "經度(度)" + getposition.coords.longitude + "<br />" +
              "高度(度)" + getposition.coords.altitude + "<br />" +
              "位置誤差(公尺) " + getposition.coords.accuracy + "<br />" +
              "高度誤差((公尺)" + getposition.coords.altitudeAccuracy + "<br />" +
              "移動方向(度)" + getposition.coords.heading + "<br />" +
        "移動速度(公尺/秒)" + getposition.coords.speed + "<br />" +
              "取得位置資訊的時間 " + getposition.timestamp;
        initMap(getLat, getLon);
    };
    function initMap(getLat, getLon) { //建立Google 地圖
        var map = new google.maps.Map(document.getElementById('map'), {
            center: { lat: getLat, lng: getLon }, //地圖中心點，套用Geolocation取得的經緯度
            scrollwheel: false,
            zoom: 13 //地圖顯示大小
        });
        var image = '../images/group-2.png'; //地圖上的icon圖示檔案路徑
        var marker = new google.maps.Marker({  //建立地圖上的icon圖示
            position: { lat: getLat, lng: getLon }, //地圖中心點，套用Geolocation取得的經緯度
            icon: image, //icon圖示
            map: map,
            title: "You are here!"
        });
    }
 
  
    function getError(error) {
        alert('code: ' + error.code + '\n' +
              'message: ' + error.message + '\n');
    }

})();

(待)

2016/12/10 Sunallen